import React from 'react';
import { Path } from 'react-native-svg';
import Svg from '../Svg';
import { globalColors } from '@/design-system';

export function FarcasterIcon({ color = globalColors.grey100, width = 25, height = 18 }: { color: string; width: number; height: number }) {
  return (
    <Svg height={height} viewBox="0 0 25 23" width={width}>
      <Path
        d="M4.28994516,0 L20.4141931,0 L20.4141931,23 L18.0473326,23 L18.0473326,12.464503 L18.0241336,12.464503 C17.7625211,9.55274798 15.322935,7.2709406 12.3520691,7.2709406 C9.38120331,7.2709406 6.94161715,9.55274798 6.68000469,12.464503 L6.65680572,12.464503 L6.65680572,23 L4.28994516,23 L4.28994516,0 Z"
        fill={color}
      />
      <Path
        d="M0,3.26448963 L0.961542302,6.52901266 L1.7751371,6.52901266 L1.7751371,19.735477 C1.36664221,19.735477 1.03549941,20.0676452 1.03549941,20.4774049 L1.03549941,21.3677385 L0.88758519,21.3677385 C0.479090308,21.3677385 0.147914223,21.6999067 0.147914223,22.1096664 L0.147914223,23 L8.43194282,23 L8.43194282,22.1096664 C8.43194282,21.6999067 8.10080001,21.3677385 7.69230513,21.3677385 L7.54439091,21.3677385 L7.54439091,20.4774049 C7.54439091,20.0676452 7.21321482,19.735477 6.80471994,19.735477 L5.91716804,19.735477 L5.91716804,3.26448963 L0,3.26448963 Z"
        fill={color}
      />
      <Path
        d="M18.1952801,19.735477 C17.7867852,19.735477 17.4556091,20.0676452 17.4556091,20.4774049 L17.4556091,21.3677385 L17.3076949,21.3677385 C16.8992,21.3677385 16.5680572,21.6999067 16.5680572,22.1096664 L16.5680572,23 L24.8520858,23 L24.8520858,22.1096664 C24.8520858,21.6999067 24.5209097,21.3677385 24.1124148,21.3677385 L23.9645006,21.3677385 L23.9645006,20.4774049 C23.9645006,20.0676452 23.6333578,19.735477 23.2248629,19.735477 L23.2248629,6.52901266 L24.0384577,6.52901266 L25,3.26448963 L19.082832,3.26448963 L19.082832,19.735477 L18.1952801,19.735477 Z"
        fill={color}
      />
    </Svg>
  );
}
